<template>
	<view class="bg-white">
		<cu-custom bgColor="bg-white" :isBack="true">
			<block slot="content">历史合同详情</block>

		</cu-custom>
		<view style="padding: 15px">
			<view style="
          background-color: #f3f5fc;
          border-radius: 10px;
          padding: 15px 10px;
          position: relative;
        ">
				<text style="color: #4591fe; font-weight: 400; font-size: 12px">
					创建日期：{{ dataObj.createTime }}
				</text>

			</view>

			<view style="margin-top: 20px">
				<view class="action" style="margin-bottom: 10px">
					<text class="cuIcon-titles" style="color: #1e5eff"></text>
					<text style="color: #000000; font-weight: bold; font-size: 30rpx">
						基础信息
					</text>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						公司
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						<view style="
                background-color: #e1ebfa;
                padding: 5px 10px;
                margin-top: -5px;
                width: 120px;
                border-radius: 2px;
              ">
							<image src="@/static/images/gongsi.png" style="width: 12px;height: 12px;margin-right: 5px;">
							</image>
							<text style="color: #101317; font-size: 13px; font-weight: 500">
								{{ dataObj.company_dictText }}
							</text>
						</view>
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						姓名
					</view>
					<view class="flex-sub padding-sm margin-xs radius" style="color: #4591FE;"
						@click="toDetails(dataObj.id)">
						{{ dataObj.userId_dictText }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						性别
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.sex_dictText }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						身份证号
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.idCard }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						进厂时间
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{
              dataObj.inTime != null ? dataObj.inTime.replace(/-/g, "/") : null
            }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						工号
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.workNo }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						联系电话
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.phone }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						年龄
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.age }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						出生年月
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{
              dataObj.birthday != null
                ? dataObj.birthday.replace(/-/g, "/")
                : null
            }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						合同类型
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.signType_dictText }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						合同类型
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.contractType_dictText }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						工龄
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.seniority }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						分类
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.classification }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						部门编码名称
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.departIds_dictText }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						岗位
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.post }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						班次
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.classes }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						计费标准
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.freightBasis_dictText }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						合同间隔时间
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						{{ dataObj.daysFromSigning }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						合同起始时间
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						<!-- {{dataObj.contractStartTime}} -->
						{{
              dataObj.contractStartTime != null
                ? dataObj.contractStartTime.replace(/-/g, "/")
                : null
            }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						合同到期时间
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						<!-- {{dataObj.contractEndTime}} -->
						{{
              dataObj.contractEndTime != null
                ? dataObj.contractEndTime.replace(/-/g, "/")
                : null
            }}
					</view>
				</view>
				<view class="flex" style="width: 300px">
					<view class="flex-sub padding-sm margin-xs radius textStyle">
						合同签订时间
					</view>
					<view class="flex-sub padding-sm margin-xs radius">
						<!-- {{dataObj.contractSigningTime}} -->
						{{
              dataObj.contractSigningTime != null
                ? dataObj.contractSigningTime.replace(/-/g, "/")
                : null
            }}
					</view>
				</view>

			</view>
			<view class="action" style="margin-top: 10px">
				<text class="cuIcon-titles" style="color: #1e5eff"></text>
				<text style="color: #000000; font-weight: bold; font-size: 30rpx">
					合同附件
				</text>
			</view>
			<view style="
          margin-top: 10px;
          background-color: #f9f9f9;
          border-radius: 10px;
          padding: 15px 25px;
        ">
				<view style="display: flex">
					<view style="
              width: 20px;
              height: 20px;
              background-color: #34b483;
              border-radius: 50%;
            "></view>
					<span style="margin-left: 15px; color: #101317; font-weight: 500">合同附件</span>
					<!-- <image class="nav-right-image" src="@/static/images/xiazai.png"></image> -->
					<!-- <a style="margin-left: 15px;color: #4591FE;" @click="reUpload">重新上传</a> -->
				</view>
				<view v-for="(item, index) in dataObj.contractFiles" :key="index">
					{{ item.contractFile }}
				</view>
				<view style="display: flex; margin-top: 15px">
					<view style="
              width: 20px;
              height: 20px;
              background-color: #34b483;
              border-radius: 50%;
            "></view>
					<span style="margin-left: 15px; color: #101317; font-weight: 500">合同补充条款</span>
					<!-- <image class="nav-right-image" src="@/static/images/xiazai.png"></image> -->
				</view>
				<view v-for="(item, index) in dataObj.contractSupplements" :key="index">
					{{ item.contractSupplementFile }}
				</view>
			</view>
			<!-- <view class="action" style="margin-top: 20px">
				<text class="cuIcon-titles" style="color: #1e5eff"></text>
				<text style="color: #000000; font-weight: bold; font-size: 30rpx">
					合同续签记录
				</text>
			</view>
			<view v-for="(item, index) in dataObj.contractRenewals" :key="index" style="
          margin-top: 10px;
          background-color: #f9f9f9;
          border-radius: 10px;
          padding: 30rpx 15rpx;
        ">
				<view style="display: flex">
					<span
						style="margin-left: 15px; color: #101317; font-weight: 500">续签开始时间:{{ item.contractStartTime }}</span>
				</view>
				<view style="display: flex; margin-top: 20rpx">
					<span
						style="margin-left: 15px; color: #101317; font-weight: 500">续签结束时间:{{ item.contractEndTime }}</span>
				</view>
				<view style="display: flex; margin-top: 20rpx">
					<span style="margin-left: 15px; color: #101317; font-weight: 500">详情:{{ item.details }}</span>
				</view>
			</view> -->

		</view>
	</view>
</template>

<script>
	import moment from "moment";
	export default {
		data() {
			return {
				createTime: "2023/10/10 12:00",
				renewalTime: "10天",
				retireTime: "235天",
				dataObj: {

				},
				dataObj2: {

				},
				approvalRecords: [{
					title: "总经理",
					name: "陈婷婷",
					area: "手写区域",
					state: "同意",
					manager: "企管",
					dateTime: "2023/10/10 12:00",
				}, ],
			};
		},
		onLoad: function(options) {
			this.dataObj.id = options.id;
			// 在这里可以使用获取到的 id 参数进行后续操作
		},
		mounted() {
			this.getDetail();
		},
		computed: {},
		methods: {
			toDetails(id) {
				uni.navigateTo({
					url: "/pages/historicalEmployee/historicalEmployeeDetails/index?id=" + id
				})
			},
			getDetail() {
				this.$http
					.get("/crm_contract/crmContract/queryDetail/" + this.dataObj.id)
					.then((res) => {
						if (res.data.success) {
							this.dataObj = res.data.result;
							// this.dataObj['avatar'] = this.getFileAccessHttpUrl(this.dataObj['avatar'])
							// console.log(this.dataObj['avatar'])
							this.approvalRecords = this.dataObj.approvalRecords;
						}
					});
			},
			urging(id) {
				const params = {
					applicationId: id,
					approvalType: 1,
				};
				this.$http
					.get("/crm_on_hand/crmOnHand/urge", {
						params: params,
					})
					.then((res) => {
						if (res.data.success) {
							this.$refs.urgingPopup.open("center");
						}
					});
			},
			reUpload() {
				console.log("重新上传");
			},
		},
	};
</script>

<style>
	.cu-form-group {
		background-color: #ffffff;
		line-height: 15px;
		padding: 0.5px 15px;
		display: flex;
		align-items: center;
		min-height: 42px;
		justify-content: space-between;
	}

	.cu-form-group uni-picker .picker {
		line-height: 15px;
		font-size: 15px;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
		width: 100%;
		text-align: right;
	}

	.cu-form-group uni-picker::after {
		font-family: cuIcon;
		line-height: 15px;
		display: block;
		content: "\e6a3";
		position: absolute;
		font-size: 17px;
		color: #8799a3;
		width: 31px;
		text-align: center;
		top: 0;
		bottom: 0;
		right: -10px;
		margin: auto;
	}

	/deep/ .uni-radio-input {
		width: 15px;
		height: 15px;
	}

	.nav-right-image {
		width: 40rpx;
		height: 40rpx;
		margin-left: 15px;
	}

	.padding-sm {
		padding: 5px;
	}

	.textStyle {
		font-size: 13px;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		color: #101317;
		line-height: 22px;
	}
</style>